﻿<!DOCTYPE html>
<html lang="en">
<head>
    <link href="../../css/functionalAreas/dronePatrol/BigData.css" rel="stylesheet" type="text/css" />
    <link href="../../css/functionalAreas/dronePatrol/index.css" rel="stylesheet" type="text/css" />
    <link href="../../css/functionalAreas/dronePatrol/index01.css" rel="stylesheet" type="text/css" />
    <script src="../../js/functionalAreas/dronePatrol/jquery.js"></script>
    <link href="../../js/functionalAreas/dronePatrol/bstable/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="../../js/functionalAreas/dronePatrol/bstable/css/bootstrap-table.css" rel="stylesheet" type="text/css" />
    <link href="../../css/functionalAreas/dronePatrol/Security_operation.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="../../js/functionalAreas/dronePatrol/artDialog/skins/default.css" type="text/css"/>
    <script src="../../js/functionalAreas/dronePatrol/laydate.js"></script>
    <script src="../../js/functionalAreas/dronePatrol/Home_page.js"></script>
    <meta charset="UTF-8">
    <title>大数据管理平台</title>
</head>
<body >
<div class="data_bodey">


        <div style="display: flex;width: 100%;">
            <div  style="flex:20;margin-right: 295px;height: 35px">
                <ul  role="tablist" style="display:flex;justify-content: space-between">
                    <li role="presentation" style="padding-top: 10px;padding-left: 55px"><a href="../../index.html" style="flex: 12;margin: 5px;color: #fff;font-size: 30px;text-decoration: none;padding-top: 10px;font-weight: bold" >云南森林火灾大数据平台</a></li>
                    <li role="presentation"  style="padding-top: 20px;padding-left: 270px"><a href="../../index.html" style="flex: 1;margin: 5px;color: #fff;font-size: 15px;text-decoration: none;font-weight: bold" >首页</a></li>
                    <li role="presentation" style="padding-top: 20px"><a href="../../html/functionalAreas/forestDataDisplay.html" style="flex: 1;color: #fff;font-size: 15px;text-decoration: none;font-weight: bold">各森林数据展示</a></li>
                    <li role="presentation" style="padding-top: 20px"><a href="../../html/functionalAreas/forestFireForecast.html" style="flex: 1;font-size: 15px;text-decoration: none;font-weight: bold;color: #fff">林火预测</a></li>
                    <li role="presentation" style="padding-top: 20px"><a href="../../html/functionalAreas/dronePatrol.html" style="flex: 3;color: #fff;font-size: 15px;text-decoration: none;font-weight: bold;color: #337ab7;">无人机巡逻</a></li>
                    <li role="presentation" style="padding-top: 20px"><a href="../../html/systemManagement/index.html" style="flex: 2;color: #fff;font-size: 15px;text-decoration: none;font-weight: bold">系统管理</a></li>
                </ul>
            </div>
        </div>

    <div class="index_tabs" >
        <!--安防运作-->
        <div class="inner" style="height: 109%;">

            <div class="left_cage">
                <div class="dataAllBorder01 cage_cl" style="margin-top: 9% !important; height: 24%;">
                    <video autoplay="autoplay" loop="loop" class="dataAllBorder02 video_cage"  controlsList="nodownload" muted>
                        <source class="video" title="主监控位" src="../../video/test_mv02.mp4"/>
                    </video>
                </div>

                <div class="dataAllBorder01 cage_cl" style="margin-top: 3.5% !important; height: 69%; position: relative;">
                    <div class="dataAllBorder02" style="position: relative; overflow: hidden;">
                        <!--标题栏-->
                        <div class="map_title_box" style="height: 6%">
                            <div class="map_title_innerbox">
                                <div class="map_title">巡逻航线</div>
                            </div>
                        </div>
                        <div class="map" id="map"  style="margin: 0;padding: 0;width: 100%;height: 100%"></div>
                        <!--地图显示信息选择-->
                        <div class="display_type_box display_box" style="display: none;overflow:auto">
                            <div class="display_type_center_box">
                                <ul class="display_type_inner_box" id="layerList">
                                    <li class="display_type_msg"><input id="zt_4" type="checkbox" class="display_type_chose"/> 危化品企业</li>
                                    <li class="display_type_msg"><input  id="zt_1" type="checkbox" class="display_type_chose"/>仓库</li>
                                    <li class="display_type_msg"><input  id="zt_5" type="checkbox" class="display_type_chose"/>学校</li>
                                    <li class="display_type_msg"><input  id="zt_6" type="checkbox" class="display_type_chose"/>医疗卫生</li>
                                    <li class="display_type_msg"><input  id="zt_2" type="checkbox" class="display_type_chose"/>加油站</li>
                                    <li class="display_type_msg"><input  id="zt_0" type="checkbox" class="display_type_chose"/>停车场</li>
                                    <li class="display_type_msg"><input  id="zt_3" type="checkbox" class="display_type_chose"/>派出所</li>
                                    <li class="display_type_msg"><input  id="zt_7" type="checkbox" class="display_type_chose"/>应急避难场所</li>
                                    <li class="display_type_msg">----------------------------------</li>
                                    <li class="display_type_msg"><input id="zt_14" type="checkbox" class="display_type_chose" />危化品运输车辆</li>
                                    <li class="display_type_msg"><input id="zt_11" type="checkbox" class="display_type_chose" />监控设备</li>
                                    <li class="display_type_msg"><input id="zt_13" type="checkbox" class="display_type_chose" />巡逻警员</li>
                                    <li class="display_type_msg"><input id="zt_12" type="checkbox" class="display_type_chose" />巡逻警车</li>
                                </ul>
                            </div>
                            <div class="display_type_funct_box">
                                <span class="display_type_funct display_type_funct_sure">确定</span>
                            </div>
                        </div>

                    </div>
                </div>
            </div>

            <div class="center_cage">
                <div class="dataAllBorder01 cage_cl" style="margin-top: 1.5% !important; height: 72%;">
                    <div class="dataAllBorder02 video_cage" style="display: flex;flex-wrap: wrap;">
<!--                        <dronePatrol class="video_around video_around_chose" src="video/video.jpg">-->
                        <video autoplay="autoplay" loop="loop" class="video_around " title="循环监控02" style="flex: 1" controls controlsList="nodownload" muted>
                            <source class="video" title="主监控位" src="../../video/video.mp4"/>
                        </video>

                        <video autoplay="autoplay" loop="loop" class="video_around " title="循环监控02" style="flex: 1;padding-left: 10px" controls controlsList="nodownload" muted>
                        <source class="video"  src="../../video/video.mp4"/>
                        </video>

                        <video autoplay="autoplay" loop="loop" class="video_around " title="循环监控02" style="flex:1;padding-top: 10px" controls controlsList="nodownload" muted>
                            <source class="video"  src="../../video/video.mp4"/>
                        </video>

                        <video autoplay="autoplay" loop="loop"  class="video_around" title="循环监控02"  style="flex:1;padding-left: 10px;padding-top: 10px" controls controlsList="nodownload" muted>
                            <source class="video"  src="../../video/2.mp4"/>
                        </video>

                    </div>
                </div>


                <div class="dataAllBorder01 cage_cl" style="margin-top: 0.6% !important; height: 24%;">
                    <div class="dataAllBorder02" id="map_title_innerbox">
                        <div class="map_title_box">
                            <div class="map_title_innerbox">
                                <div class="map_title" style="background-image: url(../../images/functionalAreas/dronePatrol/second_title.png);">无人机巡逻具体信息</div>
                            </div>
                        </div>
                        <table id="table" style="width: 100%;margin-top: 10px"></table>
                    </div>

                    <div class="dataAllBorder02" id="map_title_innerbox1" style="display: none; position: relative;">
                        <div class="map_title_box">
                            <div class="map_title_innerbox">
                                <div class="map_title" style="background-image: url(../../images/functionalAreas/dronePatrol/second_title.png);">xxxxx条件扫描</div>
                            </div>
                        </div>
                        <ul class="tab_msg_box">
                            <li class="tab_msg tab_msg01 tab_msg_current">xxxxx</li>
                            <li class="tab_msg tab_msg02">xxx</li>
                        </ul>
                        <div class="table1">
                            <table id="table1" style="width: 100%"></table>
                        </div>
                        <div class="table2" style=" display: none;">
                            <table id="table2" style="width: 100%;"></table>
                        </div>
                    </div>

                </div>
            </div>

            <div class="right_cage">
                <!--顶部切换位置-->
                <div class="dataAllBorder01 cage_cl" style="margin-top: 9% !important; height: 35%">
                    <div class="dataAllBorder02" id="cage_cl" >
                        <div class="analysis">巡逻里程：</div>
                        <ul  class="data_show_box">
                            <li class="data_cage">0</li>
                            <li class="data_cage">0</li>
                            <li class="data_cage" style="background-image: none;">,</li>
                            <li class="data_cage">8</li>
                            <li class="data_cage">8</li>
                            <li class="data_cage">8</li>
                        </ul>
                        <div class="depart_number_box">
                            <ul class="depart_number_cage">
                                <li class="depart_name">地区一：</li>
                                <li class="depart_number">保山</li>
                            </ul>
                            <ul class="depart_number_cage">
                                <li class="depart_name">地区二：</li>
                                <li class="depart_number">昭通</li>
                            </ul>
                            <ul class="depart_number_cage" style="margin-bottom: 0px;">
                                <li class="depart_name">地区三：</li>
                                <li class="depart_number">昆明</li>
                            </ul>
                            <ul class="depart_number_cage" style="margin-bottom: 0px;">
                                <li class="depart_name">地区四：</li>
                                <li class="depart_number">丽江</li>
                            </ul>
                        </div>
                    </div>
                </div>

                <div class="dataAllBorder01 cage_cl check_increase" style=" margin-top: 1.5%;height:33.2% !important;">
                    <!--切换01-->
                    <div class="dataAllBorder02 over_hide dataAllBorder20" id="over_hide" >
                        <div style="text-align: center;margin-top: 10px"> <a style="color: #fff;text-align: center;">历史巡逻记录</a></div>
                        <div class="dataAllBorder02 over_hide dataAllBorder20" style="border: 1px solid #000">
                            <table id="tableId" class="table table-bordered"  style="margin-top: 10px" >
                                <thead>
                                <tr>
                                    <th style="width: 18%">日期</th>
                                    <th>地区</th>
                                    <th>火险等级</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr >
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>200m-5km</td>
                                </tr>
                                <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>4km-80km</td>
                                </tr>
                                <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>400m-2km</td>
                                </tr>
                                <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>1km</td>
                                </tr>
                                <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>2km</td>
                                </tr>
                                <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>500m-2km</td>
                                </tr>
                                <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>500m-2km</td>
                                </tr> <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>500m-2km</td>
                                </tr> <tr>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>xxxxxxx</td>
                                    <td>500m-2km</td>

                                </tbody>
                            </table>
                        </div>

                    </div>


                </div>

                <div class="dataAllBorder01 cage_cl check_decrease" style="margin-top: 1.5% !important; height: 25%; position: relative;">
                    <div class="dataAllBorder02 over_hide" style="padding: 1.2%;">
                            <video autoplay="autoplay" loop="loop" class="dataAllBorder02 video_cage"  controlsList="nodownload" muted>
                                <source class="video"  src="../../video/test_mv02.mp4"/>
                            </video>

                    </div>
                </div>
            </div>

        </div>

    </div>
</div>

<script src="../../js/functionalAreas/dronePatrol/echarts-all.js"></script>
<script src="../../js/functionalAreas/dronePatrol/echarts.min.js"></script>
<script src="../../js/functionalAreas/dronePatrol/index.js"></script>
<script src="../../js/functionalAreas/dronePatrol/bstable/js/bootstrap.min.js"></script>
<script src="../../js/functionalAreas/dronePatrol/bstable/js/bootstrap-table.js"></script>
<script type="text/javascript" src="../../js/functionalAreas/dronePatrol/jquery.pagination.js"></script>
<script src="../../js/functionalAreas/dronePatrol/bstable/js/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=5ieMMexWmzB9jivTq6oCRX9j&callback"></script>

    <!--<script src="js/MainMap.js"></script>-->
<script src="../../js/functionalAreas/dronePatrol/Home_page.js"></script>
<script src="../../js/functionalAreas/dronePatrol/artDialog/artDialog.js"></script>
<script src="../../js/functionalAreas/dronePatrol/artDialog/plugins/iframeTools.source.js"></script>
<script>
    var number;
    $(function() {
        if (window.screen.height <= 768) {
            number = 4;
        } else if (window.screen.height > 768 && window.screen.height <= 900) {
            number = 6
        } else if (window.screen.height > 1080) {
            number = 8
        }
    });


//    翻页模块
    $(".tcdPageCode").createPage({
        pageCount:5,
        current:1,
        backFn:function(p){}
    });
    $(".chemistry_tcdPageCode").createPage({
    pageCount:4,
    current:1,
    backFn:function(p){}
});
    $(".enterprise_tcdPageCode").createPage({
    pageCount:4,
    current:1,
    backFn:function(p){}
});
    $(".car_tcdPageCode").createPage({
    pageCount:4,
    current:1,
    backFn:function(p){}
});

    $(function () {
        $(".tit02Diva a").each(function (index) {
            $(this).on("click",function () {
                $(".data_map").eq(index).fadeIn().siblings(".data_map").stop().hide();
                $(this).prev('i').removeClass('i_crlieAction');
                $(this).siblings('a').prev('i').addClass('i_crlieAction');

            })
        });
        BootstrapTable();
        Echarts();
        $("#fresh_tool").click(function(event){
            event.stopPropagation();
            cancel();
        })

    });
    function EventClick(){
        $(".check_increase").removeClass("check_increase_act");
        $("#over_hide1").show().siblings().hide();
        $(".check_decrease").show();
        $("#cage_cl").hide();
        $("#map_title_innerbox").hide();
        $("#cage_cl1").show();
//        $("#over_hide").show();
        $("#map_title_innerbox1").show();
        $(".addition_check_in").hide();
        $("#car_check_in").hide();
        BootstrapTable();
    }
    function cancel(e){
        $(".check_increase").removeClass("check_increase_act");
        $("#over_hide").show().siblings().hide();
        $(".check_decrease").show();
        $("#cage_cl").show();
        $("#cage_cl1").hide();
//        $("#cage_cl").show();
//        $("#over_hide1").show();
//        $("#map_title_innerbox").show();
        BootstrapTable();
    }




    function BootstrapTable() {
        $('#table').bootstrapTable({
            method: "get",
            striped: true,
            singleSelect: false,
            url: "../../json/dronePatrol/DGCar.json",
            dataType: "json",
            pageSize: number,
            pageNumber: 1,
            search: false, //显示搜索框
            contentType: "application/x-www-form-urlencoded",
            queryParams: null,
            columns: [
                {
                    title: '巡逻地区',
                    field: 'carno',
                    width:80,
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '巡逻面积',
                    field: 'company',
                    align: 'center',
                    valign: 'middle'
                },

                {
                    title: '无人机高度',
                    field: 'content',
                    align: 'center'
                },

                {
                    title: '可疑情况经纬度',
                    field: 'speed',
                    width:80,
                    align: 'center'
                },
                {
                    title: '火灾蔓延方向',
                    field: 'load',
                    width:80,
                    align: 'center'
                },
                {
                    title: '操作',
                    field: 'load',
                    align: 'center',
                    formatter: function (value, row) {
                        var e = '<a  href="dronePatrolDetailInfo.html?index=1" title="" onclick="showCarDetai()">查看详情</a> ';

                        return e ;
                    }
                }

            ]
        });
        $('#table1').bootstrapTable({
            method: "get",
            striped: true,
            singleSelect: false,
            url: "../../json/dronePatrol/note1.json",
            dataType: "json",
            pagination: true, //分页
            pageSize: number,
            pageNumber: 1,
            search: false, //显示搜索框
            contentType: "application/x-www-form-urlencoded",
            queryParams: null,
            columns: [
                {
                    title: "威胁源",
                    field: 'id',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '辐射距离',
                    field: 'title',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '威胁范围',
                    field: 'type',
                    align: 'center',
                    valign: 'middle'
                },

                {
                    title: '危害类型',
                    field: 'person',
                    align: 'center'
                }

            ]
        });
        $('#table2').bootstrapTable({
            method: "get",
            striped: true,
            singleSelect: false,
            url: "../../json/dronePatrol/note2.json",
            dataType: "json",
            pagination: true, //分页
            pageSize: number,
            pageNumber: 1,
            search: false, //显示搜索框
            contentType: "application/x-www-form-urlencoded",
            queryParams: null,
            columns: [
                {
                    title: "威胁源",
                    field: 'id',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '辐射距离',
                    field: 'title',
                    align: 'center',
                    valign: 'middle'
                },
                {
                    title: '威胁范围',
                    field: 'type',
                    align: 'center',
                    valign: 'middle'
                },

                {
                    title: '危害类型',
                    field: 'person',
                    align: 'center'
                }

            ]
        });
    }

    function Echarts() {

    }


    function TimeControl(){
        $(".message_scroll_box").animate({marginTop:96},800,
                function(){
                    $(".message_scroll_box").css({marginTop:0});    //把顶部的边界清零
                    $(".message_scroll_box .message_scroll:first").before($(".message_scroll_box .message_scroll:last"));    //在第一个新闻后面插入最后一个新闻

                });
    }

</script>

<script>
    // 参数1 tableID,参数2 div高度，参数3 速度，参数4 tbody中tr几条以上滚动
    tableScroll('tableId', 400, 3, 5)
    var MyMarhq;

    function tableScroll(tableid, hei, speed, len) {
        clearTimeout(MyMarhq);
        $('#' + tableid).parent().find('.tableid_').remove()
        $('#' + tableid).parent().prepend(
                '<table class="tableid_"><thead>' + $('#' + tableid + ' thead').html() + '</thead></table>'
        ).css({
            'position': 'relative',
            'overflow': 'hidden',
            'height': hei + 'px'
        })
        $(".tableid_").find('th').each(function(i) {
            $(this).css('width', $('#' + tableid).find('th:eq(' + i + ')').width());
        });
        $(".tableid_").css({
            'position': 'absolute',
            'top': 0,
            'left': 0,
            'z-index': 9
        })
        $('#' + tableid).css({
            'position': 'absolute',
            'top': 0,
            'left': 0,
            'z-index': 1
        })

        if ($('#' + tableid).find('tbody tr').length > len) {
            $('#' + tableid).find('tbody').html($('#' + tableid).find('tbody').html() + $('#' + tableid).find('tbody').html());
            $(".tableid_").css('top', 0);
            $('#' + tableid).css('top', 0);
            var tblTop = 0;
            var outerHeight = $('#' + tableid).find('tbody').find("tr").outerHeight();

            function Marqueehq() {
                if (tblTop <= -outerHeight * $('#' + tableid).find('tbody').find("tr").length) {
                    tblTop = 0;
                } else {
                    tblTop -= 1;
                }
                $('#' + tableid).css('margin-top', tblTop + 'px');
                clearTimeout(MyMarhq);
                MyMarhq = setTimeout(function() {
                    Marqueehq()
                }, speed);
            }

            MyMarhq = setTimeout(Marqueehq, speed);
            $('#' + tableid).find('tbody').hover(function() {
                clearTimeout(MyMarhq);
            }, function() {
                clearTimeout(MyMarhq);
                if ($('#' + tableid).find('tbody tr').length > len) {
                    MyMarhq = setTimeout(Marqueehq, speed);
                }
            })
        }

    }
</script>

<script src="../../js/functionalAreas/dronePatrol/scroll.js"></script>
<!--echarts地图-->
<script>
    $(function () {
        var myChart = echarts.init(document.getElementById('map'));
        var geoCoordMap = {
            保山:[99.167133,25.111802],
            楚雄彝族自治州:[101.546046,25.041988],
            大理白族自治州:[100.225668,25.589449],
            德宏傣族景颇族自治州:[98.578363,24.436694],
            迪庆藏族自治州:[99.706463,27.826853],
            红河哈尼族彝族自治州:[103.384182,23.366775],
            昆明市:[102.712251,25.040609],
            丽江市:[100.233026,26.872108],
            临沧市:[100.08697,23.886567],
            怒江傈僳族自治州:[98.854304,25.850949],
            普洱市:[100.972344,22.777321],
            曲靖市:[103.797851,25.501557],
            文山壮族苗族自治州:[104.24401,23.36951],
            西双版纳傣族自治州:[100.797941,22.001724],
            玉溪市:[102.543907,24.350461],
            昭通市:[103.717216,27.336999]
        };

        var XAData = [
            [{ name: "保山",value: 100  }, { name: "昭通市", value: 50 }],
        ];

        var XNData = [
            [{ name: "楚雄彝族自治州",value: 100 }, { name: "文山壮族苗族自治州", value: 50 }],

        ];

        var YCData = [
            [{ name: "迪庆藏族自治州",value: 100  }, { name: "西双版纳傣族自治州", value: 50 }],
        ];

        var planePath =
                "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";

        var convertData = function(data) {
            var res = [];
            for (var i = 0; i < data.length; i++) {
                var dataItem = data[i];

                var fromCoord = geoCoordMap[dataItem[0].name];
                var toCoord = geoCoordMap[dataItem[1].name];
                if (fromCoord && toCoord) {
                    res.push({
                        fromName: dataItem[0].name,
                        toName: dataItem[1].name,
                        coords: [fromCoord, toCoord],
                        value: dataItem[1].value
                    });
                }
            }
            return res;
        };

        var color = ["#a6c84c", '#ffa022', "#46bee9"]; //航线的颜色
        var series = [];
        [
            ["保山", XAData],
            ["楚雄彝族自治州", XNData],
            ["傣族景颇族自治州", YCData]
        ].forEach(function(item, i) {
            series.push(
                    {
                        name: item[0] + " Top3",
                        type: "lines",
                        zlevel: 1,
                        effect: {
                            show: true,
                            period: 6,
                            trailLength: 0.7,
                            color: "red", //arrow箭头的颜色
                            symbolSize: 3
                        },
                        lineStyle: {
                            normal: {
                                color: color[i],
                                width: 0,
                                curveness: 0.2
                            }
                        },
                        data: convertData(item[1])
                    },
                    {
                        name: item[0] + " Top3",
                        type: "lines",
                        zlevel: 2,
                        symbol: ["none", "arrow"],
                        symbolSize: 10,
                        effect: {
                            show: true,
                            period: 6,
                            trailLength: 0,
                            symbol: planePath,
                            symbolSize: 15
                        },
                        lineStyle: {
                            normal: {
                                color: color[i],
                                width: 1,
                                opacity: 0.6,
                                curveness: 0.2
                            }
                        },
                        data: convertData(item[1])
                    },
                    {
                        name: item[0] + " Top3",
                        type: "effectScatter",
                        coordinateSystem: "geo",
                        zlevel: 2,
                        rippleEffect: {
                            brushType: "stroke"
                        },
                        label: {
                            normal: {
                                show: true,
                                position: "right",
                                formatter: "{b}"
                            }
                        },
                        symbolSize: function(val) {
                            return val[2] / 8;
                        },
                        itemStyle: {
                            normal: {
                                color: color[i]
                            },
                            emphasis: {
                                areaColor: "#2B91B7"
                            }
                        },
                        data: item[1].map(function(dataItem) {
                            return {
                                name: dataItem[1].name,
                                value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value]),
                            };
                        })
                    }
            );
        });



        $.get('../../json/dronePatrol/530000_full.json', function (geoJson) {
            echarts.registerMap('云南', geoJson);

            myChart.setOption(option = {
                tooltip: {
                    trigger: "item",
                    formatter: function(params, ticket, callback) {
                        if (params.seriesType == "effectScatter") {
                            return  params.data.name ;
                        } else if (params.seriesType == "lines") {
                            return (
                                    params.data.fromName +
                                    "-->" +
                                    params.data.toName
                            );
                        } else {
                            return params.name;
                        }
                    }
                },
                geo: {
                    map: "云南",
                    label: {
                        emphasis: {
                            show: true,
                            color: "#fff"
                        }
                    },
                    roam: true,
                    //   放大我们的地图
                    zoom: 1,
                    itemStyle: {
                        normal: {
                            areaColor: "rgba(43, 196, 243, 0.42)",
                            borderColor: "rgba(43, 196, 243, 1)",
                            borderWidth: 1
                        },
                        emphasis: {
                            areaColor: "#2B91B7"
                        }
                    }
                },
                series: series
            });
        });
    })
</script>
</body>
</html>



























